<template>
  <div>
    <p v-if="goods.length==0">
        没有找到
    </p>
    <table v-else border="1">
      <tr>
        <td>名称</td>
        <td>价格</td>
        <td>图片</td>
        <td>购买次数</td>
        <td>评论次数</td>
        <td>操作</td>
      </tr>
      <tr v-for="g in goods" :key="g.id">
        <td>{{g.title}}</td>
        <td>{{g.price}}</td>
        <td><img :src="'http://127.0.0.1:8000/'+g.img" alt=""></td>
        <td>{{g.buy_num}}</td>
        <td>{{g.comment_num}}</td>
        <td>
          <button @click="buy(g.id)">购买</button>
        </td>
      </tr>
    </table>
  </div>
</template>

<script>
  export default {
    name: "Search",
    data() {
      return {
        goods_title: '',
        max_price: '',
        min_price: '',
        goods: [],
      }
    },
    created() {
      this.goods_title = this.$route.query.goods_title
      this.max_price = this.$route.query.max_price
      this.min_price = this.$route.query.min_price
      this.get_search_goods()
    },
    methods: {
      get_search_goods() {
        this.axios.get('http://127.0.0.1:8000/search/', {
          params: {
            goods_title: this.goods_title,
            max_price: this.max_price,
            min_price: this.min_price
          }
        }).then(res => {
          console.log(res.data)
          this.goods = res.data.data
        }).catch(err => {
          console.log(err)
        })
      }
    }
  }
</script>

<style scoped>

</style>
